<template>
    <div style="height: 90%">
        <el-row style="height: 50%;margin-top: 10px">
            <el-row type="flex" justify="space-between">
                <el-col>
                    <span class="detail-title">用户详情</span>
                    <el-button type="primary" plain size="mini" @click="back" icon="el-icon-back" circle></el-button>
                    <el-button type="primary" plain size="mini" @click="refresh" icon="el-icon-refresh"
                               circle></el-button>
                </el-col>
                <el-col :span="2" :pull="2">
                    <el-dropdown @command="handleoper">
      <span class="el-dropdown-link">
          <i class="el-icon-more" style="color: #409EFF"></i>
      </span>
                        <el-dropdown-menu slot="dropdown">
                            <el-dropdown-item command="modify">修改学员</el-dropdown-item>
                            <el-dropdown-item command="delete">删除学员</el-dropdown-item>
                        </el-dropdown-menu>
                    </el-dropdown>
                </el-col>
            </el-row>
            <el-row style="margin-bottom: 10px" type="flex" justify="center">
                <el-button type="primary" circle>郑</el-button>
            </el-row>
            <el-row type="flex" justify="center">
                <span style="font-size: 14px;font-weight: bold">王岚</span>
                <i class="el-icon-info alert" style="color: #409EFF"></i>
            </el-row>
            <el-row class="notify-row" type="flex" justify="center">
                <el-tag type="primary" plain size="mini">在读学员</el-tag>
                <el-tag type="primary" style="margin-left: 10px" plain size="mini">教室通知</el-tag>
            </el-row>
            <el-row style="margin-top: 10px" type="flex" justify="start">
                <el-col :span="18" :offset="3" class="class-tel">
                    <i class="el-icon-info" style="color: #409EFF"></i>
                    <span class="class-tel-desc">13111111111</span>
                </el-col>
            </el-row>
            <el-row type="flex" justify="start">
                <el-col class="class-tel" :span="18" :offset="3">
                    <i class="el-icon-info" style="color: #409EFF"></i>
                    <span class="class-tel-desc">2018-05-11</span>
                </el-col>
            </el-row>
            <el-row style="margin-top: 10px" type="flex" justify="center">
                <el-button class="buy-class" type="primary" size="mini">微信绑定</el-button>
                <el-button class="buy-class" type="primary" size="mini">购买课程</el-button>
            </el-row>
        </el-row>

    </div>
</template>

<script>
    import {mapActions, mapState, mapGetters} from 'vuex'
    import headTop from '../../components/headTop'
    import {userList} from '@/api/getData'
    import ElInput from "../../../node_modules/element-ui/packages/input/src/input.vue";
    import ElOption from "../../../node_modules/element-ui/packages/select/src/option.vue";

    export default {
        name: 'userDetailHead',
        props: {},
        data() {
            return {
                userInfo: {},
                childForm: {}
            }
        },
        components: {
            ElOption,
            ElInput,
            headTop,

        },
        computed: {},
        created() {
        },
        mounted() {

        },
        methods: {},
    }
</script>
<style lang="less" scoped>
    @import '../../style/mixin';

    .el-table .sks {
        background: #c2e7b0;
    }

    .alert {
        height: 5px;
        width: 5px;
    }

    .class-tel-desc {
        font-size: 14px;

    }


</style>
